/**
 * 包含3行2列：第一行高度为30px，第二行自动调整，
 * 第三行高度为50px；第一列宽度为100px，第二列为弹性宽度。
*/
.container {
  @apply h-screen w-screen bg-white;
  display: grid;
  grid-template:
    'drag menu' 30px
    'category content' auto
    'nav content' 50px /100px 1fr;

  div {
    &.drag {
      grid-area: drag;
      -webkit-app-region: drag;
      cursor: pointer; // 添加鼠标悬停效果
      @apply border-r border-b;
    }
    &.menu {
      grid-area: menu;
      -webkit-app-region: drag;
      cursor: pointer; // 添加鼠标悬停效果
      @apply border-b;
    }
    &.nav {
      grid-area: nav;
      @apply border-t border-r;
    }
    &.category {
      @apply border-r;
    }
    &.content {
      grid-area: content;
    }
  }
}
